import { forwardRef, useImperativeHandle } from 'react'

import { WelcomeProps, WelcomeRefProps } from './Welcome.define'
import styles from './Welcome.module.css'

export default forwardRef<WelcomeRefProps, WelcomeProps>(function Welcome(
  { msg },
  ref
) {
  function say() {
    alert(msg)
  }

  useImperativeHandle(ref, () => ({
    say
  }))

  return <h2 className={styles.welcome}>{msg}</h2>
})
